import { BasicColumn, BasicTable, FormSchema, useTable } from "@/components/Table";
import { useTranslation } from "react-i18next";
// import Toolbar from "@/components/ViewComponents/Toolbar";
import { diagnosisPage } from "@/api/MedicalExamination";
import { TimeDate } from "@/utils/util";
import { Tag } from "antd";
import moment from "moment";
const index = () => {
	const { t } = useTranslation();
	const searchFormSchema: FormSchema[] = [
		{
			label: t("felix_ui.dt_date"),
			field: "rxDtime",
			component: "RangePicker",
			componentProps: {
				showTime: {
					defaultValue: [moment("00:00:00", "DD-MM-YYYY"), moment("23:59:59", "DD-MM-YYYY")]
				}
			}
		},
		{
			label: t("kevin_ui.patient_id"),
			field: "patientId",
			component: "Input"
		},
		{
			label: t("kevin_ui.full_name"),
			field: "fullName",
			component: "Input"
		},
		{
			label: t("felix_ui.birthday"),
			field: "birthday",
			component: "Input"
		},
		{
			label: t("kevin_ui.age"),
			field: "age",
			component: "Select",
			componentProps: {
				options: [
					{ label: "> 90", value: 91 },
					{ label: ">= 60", value: 60 },
					{ label: ">= 15", value: 15 },
					{ label: "< 15", value: 14 },
					{ label: "< 6", value: 5 }
				]
			}
		},
		{
			label: t("kevin_ui.gender"),
			field: "gender",
			component: "Select",
			componentProps: {
				options: [
					{ label: "female", value: 0 },
					{ label: "male", value: 1 }
				]
			}
		},
		{
			label: t("kevin_ui.house_number"),
			field: "addrHouseno",
			component: "Input"
		},
		{
			label: t("kevin_ui.province_city"),
			field: "addrProvince",
			component: "Input"
		},
		{
			label: t("kevin_ui.district_county"),
			field: "addrDistrict",
			component: "Input"
		},
		{
			label: t("kevin_ui.ward_commune"),
			field: "addrCommune",
			component: "Input"
		},
		{
			label: t("kevin_ui.ethnicity"),
			field: "ethnicity",
			component: "Input"
		},
		{
			label: t("kevin_ui.occupation"),
			field: "occupation",
			component: "Input"
		},
		{
			label: t("felix_ui.grp_email"),
			field: "emailAddr",
			component: "Input"
		},
		{
			label: t("kevin_ui.mobile"),
			field: "mobileNumb",
			component: "Input"
		}
	];
	const columns: BasicColumn[] = [
		{
			title: t("felix_ui.full_name"),
			dataIndex: "fullName"
		},
		{
			title: t("felix_ui.gender"),
			dataIndex: "gender"
		},
		{
			title: t("flandre_ui.symptoms"),
			dataIndex: "patSymptom"
		},
		{
			title: t("felix_ui.type"),
			dataIndex: "rxType",
			render: (text, record) => {
				return record.rxType == 0 ? (
					<Tag color="success">{t("felix_ui.firstVisit")}</Tag>
				) : (
					<Tag color="error">{t("felix_ui.returnVisit")}</Tag>
				);
			}
		},
		{
			title: t("felix_ui.deptId"),
			dataIndex: "deptId"
		},
		{
			title: t("felix_ui.doctor"),
			dataIndex: "doctorName"
		},
		{
			title: t("felix_ui.diagnosisDate"),
			dataIndex: "rxDtime",
			render: text => <span>{text && TimeDate(text)}</span>
		},
		{
			title: t("felix_ui.age"),
			dataIndex: "age"
		},
		{
			title: t("felix_ui.drugName"),
			dataIndex: "drugName"
		},
		{
			title: t("felix_ui.clinicName"),
			dataIndex: "clinicName"
		},
		{
			title: t("felix_ui.doctorAdvice"),
			dataIndex: "doctorAdvice"
		},
		{
			title: t("felix_ui.rx_diagnosis"),
			dataIndex: "rxDiagnosis"
		}
	];
	const [registerTable] = useTable({
		api: diagnosisPage,
		columns,
		formConfig: {
			labelWidth: 120,
			schemas: searchFormSchema,
			showActionButtonGroup: true,
			showAdvancedButton: false,
			baseColProps: { span: 6 }
		},
		useSearchForm: true,
		maxHeight: 500,
		searchInfo: {
			isTreat: true
		}
	});
	return (
		<div className="edit_temporary_patient">
			<div className="page-content">
				<BasicTable register={registerTable}></BasicTable>
			</div>
			{/* <Toolbar btnList={["end"]} /> */}
		</div>
	);
};
export default index;
